<!--航班今日动态-->
<div class="fdt">
    <el-form style="margin-top: 20px;">
        <el-row>
            <el-form class="queryForm" :inline="true">
                <el-form-item label="航班号">
                    <el-input v-model="checkForm.flightNum"></el-input>
                </el-form-item>
                <el-form-item label="日期">
                    <el-date-picker
                            v-model="checkForm.flightDynamicDate"
                            align="right"
                            type="date"
                            placeholder=""
                            value-format="yyyy-MM-dd"
                            style="width: 150px">
                    </el-date-picker>
                </el-form-item>
                <el-form-item >
                    <el-button type="primary" @click="checkFlightDynamic">查询</el-button>
                </el-form-item>
            </el-form>
        </el-row>
    </el-form>
    <!--出港-->
    <div class="consume-panel">
        <div style="text-align: center">出港</div>
        <el-table
                @cell-dblclick="cellDblclick"
                :data="tableData"
                ref="table"
                show-pagination="false"
                :border =true
                :header-cell-class-name="getCellClass"
                min-height="350"
                max-height="400"
        >
            <!--:sort="tableSort"-->
            <el-table-column prop="flightInfo.flightNum" label="航班号" width="82" align="center">
            </el-table-column>
            <el-table-column prop="flightInfo.flightType" label="机型" width="82" align="center">
            </el-table-column>
            <el-table-column prop="flightInfo.flightNo" label="机号" width="82" align="center">
            </el-table-column>
            <el-table-column  label="机位" width="82" align="center">
                <template scope="scope">
                    {{scope.row.flightInfo.gpConfigPo?scope.row.flightInfo.gpConfigPo.gpName:scope.row.gpConfigPo?scope.row.gpConfigPo.gpName:''}}
                </template>
            </el-table-column>
            <el-table-column prop="normalAbnormality" label="性质" min-width="48" align="center">
            </el-table-column>
            <!--<el-table-column prop="importOrExport" label="进出港" min-width="80" align="center">
            </el-table-column>-->
            <!--<el-table-column  prop="originating" label="出发地"  align="center">
            </el-table-column>-->
            <el-table-column prop="destination" label="目的地"  align="center">
            </el-table-column>
            <el-table-column  prop="processStatus" label="状态" min-width="100"align="center" >
            </el-table-column>
            <el-table-column prop="takeOffTime" label="计起" min-width="70" align="center">
                <template scope="scope">
                    {{scope.row.takeOffTime?scope.row.takeOffTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="preFlyTime" label="预飞" min-width="70"  align="center">
                <template scope="scope">
                    {{scope.row.preFlyTime?scope.row.preFlyTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="realFlyTime" label="实飞" min-width="70"  align="center">
                <template scope="scope">
                    {{scope.row.realFlyTime?scope.row.realFlyTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="arriveTime" label="计达" min-width="70"  align="center">
                <template scope="scope">
                    {{scope.row.arriveTime?scope.row.arriveTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="preArriveTime" label="预达" min-width="70" align="center">
                <template scope="scope">
                    {{scope.row.preArriveTime?scope.row.preArriveTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="realArriveTime" label="实达" min-width="70" align="center">
                <template scope="scope">
                    {{scope.row.realArriveTime?scope.row.realArriveTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="isDelay" label="是否延误" min-width="90"align="center">
            </el-table-column>
            <el-table-column prop="delayReason" label="延误原因" min-width="90"align="center">
            </el-table-column>
            <el-table-column label="最新动态" align="center">
                <el-table-column label="准备起飞" align="center">
                    <template scope="scope">
                        <div :class="btnClass(scope.row.processStatus,'本站待飞')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">准备起飞</div>
                            <div class="node-button" @click="expectedToFly(scope,'出港')">准备起飞</div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="起飞" align="center">
                    <template scope="scope">
                        <div :class="btnClass(scope.row.processStatus,'本站起飞')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">起飞</div>
                            <div class="node-button" @click="takeOff(scope,'出港')">起飞</div>

                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="预计落地" align="center" :min-width="'预计落地'.length*14+20">
                    <template scope="scope">
                        <div :class="btnClass(scope.row.processStatus,'外站预计落地')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">预计落地</div>
                            <div class="node-button" @click="expectedToFall(scope,'出港')">预计落地</div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="近空" align="center" :min-width="'近空'.length*14+20">
                    <template scope="scope">
                        <div :class="btnClass(scope.row.processStatus,'站外近空')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">近空</div>
                            <div class="node-button" @click="nearSpace(scope,'出港')">近空</div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="落地" align="center">
                    <template scope="scope">
                        <div :class="btnClass(scope.row.processStatus,'站外着陆')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">落地</div>
                            <div class="node-button" @click="landing(scope,'出港')">落地</div>
                        </div>
                    </template>
                </el-table-column>


                <el-table-column label="延误" align="center">
                    <template scope="scope">
                        <div :class="(scope.row.isDelay=='延误')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">延误</div>
                            <div class="node-button" @click="delay(scope,'出港')">延误</div>
                        </div>
                    </template>
                </el-table-column>

            </el-table-column>

        </el-table>
    </div>
    <!--进港-->
    <div class="consume-panel">
        <div style="text-align: center">进港</div>
        <el-table
                @cell-dblclick="cellDblclick"
                :data="tableData1"
                ref="table"
                show-pagination="false"
                :border =true
                :header-cell-class-name="getCellClass"
                min-height="350"
                max-height="400"
        >
            <!--:sort="tableSort"-->
            <el-table-column prop="flightInfo.flightNum" label="航班号" width="82" align="center">
            </el-table-column>
            <el-table-column prop="flightInfo.flightType" label="机型" width="82" align="center">
            </el-table-column>
            <el-table-column prop="flightInfo.flightNo" label="机号" width="82" align="center">
            </el-table-column>
            <el-table-column  label="机位" width="82" align="center">
                <template scope="scope">
                    {{scope.row.flightInfo.gpConfigPo?scope.row.flightInfo.gpConfigPo.gpName:scope.row.gpConfigPo?scope.row.gpConfigPo.gpName:''}}
                </template>
            </el-table-column>
            <el-table-column prop="normalAbnormality" label="性质" min-width="48" align="center">
            </el-table-column>
          <!--  <el-table-column prop="importOrExport" label="进出港" min-width="80" align="center">
            </el-table-column>-->
            <el-table-column  prop="originating" label="出发地"  align="center">
            </el-table-column>
          <!--  <el-table-column prop="destination" label="目的地"  align="center">
            </el-table-column>-->
            <el-table-column  prop="processStatus" label="状态" min-width="100"align="center" >
            </el-table-column>
            <el-table-column prop="takeOffTime" label="计起" min-width="70" align="center">
                <template scope="scope">
                    {{scope.row.takeOffTime?scope.row.takeOffTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="preFlyTime" label="预飞" min-width="70"  align="center">
                <template scope="scope">
                    {{scope.row.preFlyTime?scope.row.preFlyTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="realFlyTime" label="实飞" min-width="70"  align="center">
                <template scope="scope">
                    {{scope.row.realFlyTime?scope.row.realFlyTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="arriveTime" label="计达" min-width="70"  align="center">
                <template scope="scope">
                    {{scope.row.arriveTime?scope.row.arriveTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="preArriveTime" label="预达" min-width="70" align="center">
                <template scope="scope">
                    {{scope.row.preArriveTime?scope.row.preArriveTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="realArriveTime" label="实达" min-width="70" align="center">
                <template scope="scope">
                    {{scope.row.realArriveTime?scope.row.realArriveTime.substr(11,5):""}}
                </template>
            </el-table-column>
            <el-table-column prop="isDelay" label="是否延误" min-width="90"align="center">
            </el-table-column>
            <el-table-column prop="delayReason" label="延误原因" min-width="90"align="center">
            </el-table-column>
            <el-table-column label="最新动态" align="center">

                <el-table-column label="准备起飞" align="center">
                    <template scope="scope">
                        <div :class="btnClass1(scope.row.processStatus,'站外待飞')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">准备起飞</div>
                            <div class="node-button" @click="expectedToFly(scope,'进港')">准备起飞</div>

                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="起飞" align="center">
                    <template scope="scope">
                        <div :class="btnClass1(scope.row.processStatus,'站外起飞')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">起飞</div>
                            <div class="node-button" @click="takeOff(scope,'进港')">起飞</div>

                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="预计落地" align="center" :min-width="'预计落地'.length*14+20">
                    <template scope="scope">
                        <div :class="btnClass1(scope.row.processStatus,'预计落地')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">预计落地</div>
                            <div class="node-button" @click="expectedToFall(scope,'进港')">预计落地</div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="近空" align="center" :min-width="'近空'.length*14+20">
                    <template scope="scope">
                        <div :class="btnClass1(scope.row.processStatus,'近空')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">近空</div>
                            <div class="node-button" @click="nearSpace(scope,'进港')">近空</div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="落地" align="center">
                    <template scope="scope">
                        <div :class="btnClass1(scope.row.processStatus,'本站着陆')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">落地</div>
                            <div class="node-button" @click="landing(scope,'进港')">落地</div>
                        </div>
                    </template>
                </el-table-column>

                <el-table-column label="延误" align="center">
                    <template scope="scope">
                        <div :class="(scope.row.isDelay=='延误')?'button-or-div-d':'button-or-div-b'">
                            <div class="node-div">延误</div>
                            <div class="node-button" @click="delay(scope)">延误</div>
                        </div>
                    </template>
                </el-table-column>
                <el-table-column label="分配机位" align="center">
                    <template scope="scope">
                        <div :class="(scope.row.gpConfigPo==null)?'button-or-div-b':'button-or-div-b1'">
                            <div class="node-button" @click="gpAllocation(scope)">分配机位</div>
                        </div>
                    </template>
                </el-table-column>
            </el-table-column>

        </el-table>
    </div>
<!--延误模态框-->
    <el-dialog
            title="提示"
            :visible.sync="dialogVisibleFdt"
            width="400px"
    >
        <div style="margin: 10px">你确定该航班已延误?</div>
        <el-form :inline="true" :model="delayReasonForm"  ref="delayReasonForm" class="dt-form-inline">
            <el-form-item label="延误原因"  prop="delayReason" label-width="100px" :rules
                    ="[{required: true, message: '请选择延误原因'}]">
                <el-select v-model="delayReasonForm.delayReason" placeholder="">
                    <el-option
                            v-for="item in delayReasons "
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>

        </el-form>
        <span slot="footer" class="dialog-footer">
    <el-button @click="cancel">取 消</el-button>
    <el-button type="primary" @click="confirmDelay">确 定</el-button>
  </span>
    </el-dialog>
<!--分配机位对话框-->
    <el-dialog
            title="机位分配"
            :visible.sync="dialogVisibleGpa"
            width="400px"
    >
        <el-form :inline="true" :model="gpAllocationForm"  ref="gpAllocationForm" class="gpa-form-inline">
            <el-form-item label="停机位"  prop="gpId" label-width="100px" :rules
                    ="[{required: true, message: '请选择机位'}]">
                <el-select v-model="gpAllocationForm.gpId" placeholder="" @change="findGpById">
                    <el-option
                            v-for="gp in gpas "
                            :key="gp.gpId"
                            :label="gp.gpName"
                            :value="gp.gpId"
                    >
                    </el-option>
                </el-select>
            </el-form-item>

        </el-form>
        <span slot="footer" class="dialog-footer">
    <el-button @click="cancelGpa">取 消</el-button>
    <el-button type="primary" @click="confirmGpa">确 定</el-button>
  </span>
    </el-dialog>
</div>